<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" th:href="@{/webjars/bootstrap/3.3.7/css/bootstrap.css}" >
    <link rel="stylesheet" th:href="@{css/main.css}">
</head>
<body>

<div id="main-top" class="container-fluid">
    <div class="row">
        <div class="navbar navbar-inverse navbar-static-top">
            <div class="navbar-header col-md-6">
                <span class="navbar-brand"><i class=""></i>启航课堂后台管理系统</span>
            </div>
            <div class="col-md-6 col-md-offset-6 login-info">
                <i class="glyphicon glyphicon-user"></i>&nbsp;&nbsp;admin
                <i class="glyphicon glyphicon-calendar"></i>&nbsp;&nbsp;2019-03-27
                <a><i class=""></i></a>
            </div>
        </div>
    </div>

</div>
<div id="left">
    <div class="left-title">
        <p>
            <span>导航模块</span>
        </p>
    </div>
    <div class="left-content navbar-fixed-bottom">
        <a href="#left-collapse" data-toggle="collapse"><span class="glyphicon glyphicon-user"></span>&nbsp;&nbsp;&nbsp;用户信息&nbsp;&nbsp;&nbsp;<i class="glyphicon glyphicon-chevron-left"></i></a>
        <ul id="left-collapse" class="collapse in">
            <li><a href="" data-html="">SQL监控</a></li>
            <li><a href="" data-html="pageBook">图书管理</a></li>
            <li><a href="">用户管理</a></li>
            <li><a href="">用户管理</a></li>
            <li><a href="">用户管理</a></li>
        </ul>
        <a href="#left-user" data-toggle="collapse"><span class="glyphicon glyphicon-home"></span>&nbsp;&nbsp;&nbsp;数据分析&nbsp;&nbsp;&nbsp;<i class="glyphicon glyphicon-chevron-left"></i></a>
        <ul id="left-user" class="collapse">
            <li><a href="">数据管理</a></li>
            <li><a href="">用户管理</a></li>
            <li><a href="">用户管理</a></li>
            <li><a href="">用户管理</a></li>
            <li><a href="">用户管理</a></li>
        </ul>
        <a href="#left-and" data-toggle="collapse"><span class="glyphicon glyphicon-cog"></span>&nbsp;&nbsp;&nbsp;系统设置&nbsp;&nbsp;&nbsp;<i class="glyphicon glyphicon-chevron-left"></i></a>
        <ul id="left-and" class="collapse">
            <li><a href="">系统工具</a></li>
            <li><a href="">用户管理</a></li>
            <li><a href="">用户管理</a></li>
            <li><a href="">用户管理</a></li>
            <li><a href="">用户管理</a></li>
        </ul>

    </div>
</div>
<div id="content-main">
    <ol class="breadcrumb">
        <li><a href="#">后台首页</a></li>
        <li><a href="#">用户管理</a></li>
        <li class="active">系统介绍</li>
    </ol>
</div>


<script type="text/javascript" th:src="@{/webjars/jquery/3.3.1/jquery.js}"></script>
<script type="text/javascript" th:src="@{/webjars/bootstrap/3.3.7/js/bootstrap.js}"></script>
<script type="text/javascript" th:src="@{js/main.js}"></script>
</body>
</html>
<iframe src="" class="navbar-fixed-bottom" scrolling="auto" width="100%" height="100%" allowtransparency="yes" id="frame"></iframe>